<template>
  <div class="contain">
    <div class="left">
        <van-image :src="require('../../../assets/images/lingshi.png')" width="125px" height="125px"></van-image>
    </div>
    <div class="right">
      <div class="top">大牌零食199-100元</div>
      <div class="center">立减100元</div>
      <div class="bottom">
        <div class="time">2023.01.01-2023.01.31</div>
        <van-button type="danger" size="small">立即使用</van-button>
      </div>
    </div>

  </div>
</template>

<script setup>

</script>

<script>
export default {
  name: 'My-coupon'
}
</script>

<style lang="less" scoped>
.contain {
    height: 375px;
    width: 100%;
    background-color: gray;
    display: flex;
    justify-content: space-between;
    align-items: center;
    .right {
        flex: 1;
        width: 100%;
        height: 250px;
        margin-left:10px ;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        .top {
            font-size: 42px;
            font-weight: 700;
            color: balck;
        }
        .center {
          font-size: 64px;
          color: #c4413c;
        }
        .bottom {
            padding-right: 30px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            .time {
                color: #6e6e6e;
                font-size: 25px;
            }
        }
    }
}

</style>
